.loader {
  width: 80px;
  height: 40px;
  border-radius: 100px 100px 0 0;
  position: relative;
  overflow: hidden;
}

.loader:before {
  content: "";
  position: absolute;
  inset: 0 0 -100%;
  background: radial-gradient(farthest-side, #ffd738 80%, #0000) left 70% top 20%/15px 15px,
  radial-gradient(farthest-side, #020308 92%, #0000) left 65% bottom 19%/12px 12px,
  radial-gradient(farthest-side, #ecfefe 92%, #0000) left 70% bottom 20%/15px 15px,
  linear-gradient(#9eddfe 50%, #020308 0);
  background-repeat: no-repeat;
  animation: l5 2s infinite;
}

@keyframes l5 {
  0%, 20% {
    transform: rotate(0)
  }
  40%, 60% {
    transform: rotate(.5turn)
  }
  80%, 100% {
    transform: rotate(1turn)
  }
}
